<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="plugins/ztree/css/zTreeStyle/zTreeStyle.css">
    <script src="plugins/ztree/js/jquery-1.4.4.min.js"></script>
    <script src="plugins/ztree/js/jquery.ztree.all-3.5.js"></script>

    <SCRIPT LANGUAGE="JavaScript">
        var zTreeObj;  //树形对象
        // zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解）
        var setting = {
            data: {
                simpleData: {
                    enable: true,  //开启了简单的json数据结构
                    idKey: "id",
                    pIdKey: "pId",
                    rootPId: 0
                }
            },
            check: {
                enable: true  //开启复选框
            }
        };
        // zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解）
        // var zNodes = [  //标准的json数据结构 使用children关键字表示上下级关系
        //     {name:"test1",  children:[
        //             {name:"test1_1"}, {name:"test1_2",children:[{name:"test_1_2_1"},{name:"test_1_2_2"}]}]},
        //     {name:"test2",  children:[
        //             {name:"test2_1"}, {name:"test2_2"}]}
        // ];


        var zNodes = [  //简单的json数据结构
            {id:1,name:"test1",pId:0},    //parentId
            {id:2,name:"test2",pId:0},
            {id:11,name:"test1_1",pId:1},
            {id:12,name:"test1_2",pId:1,checked:"true"},
            {id:121,name:"test_1_2_1",pId:12},
            {id:122,name:"test_1_2_2",pId:12},
            {id:21,name:"test2_1",pId:2},
            {id:22,name:"test2_2",pId:2},
        ];

        $(document).ready(function(){
            zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
            zTreeObj.expandAll(true); //展开所有的节点

        });

        function save() {
            // 获取选中的节点对象的id
            let moduleIdsStr = "";
            var nodes = zTreeObj.getCheckedNodes(true);
            for (let i = 0; i < nodes.length; i++) {
                if(i == (nodes.length-1)){
                    moduleIdsStr+=nodes[i].id;
                }else{
                    moduleIdsStr+=nodes[i].id +",";
                }
            }
            alert(moduleIdsStr);
        }
    </SCRIPT>
</head>

<body>
<div>
    <button onclick="save()">保存</button>
    <ul id="treeDemo" class="ztree"></ul>
</div>
</body>
</html>